<template>
	<div class="wrapper">
		<van-collapse v-model="active" @change="vancollapse">
			<van-collapse-item :title="item.channelName" :name="item.channelCode" v-for="(item,index) in tabList"
				:key="index">
				<div class="benefit" @click="pictchUp(items,indexs,index)" v-for="(items,indexs) in item.list"
					:key="indexs">
					<div class="dia" style="justify-content: space-between;">
						<div class="" v-if="items.accountType==0">
							分润账户
						</div>
						<div class="" v-else>
							返现账户
						</div>
						<div class="dia">
							<div class="" style="margin-right: 10px;">
								{{items.accountBalance}}
							</div>
							<div class="dis" v-if="items.typeIndex">
								<img src="/src/assets/terminal/check.png" alt="" />
							</div>
						</div>
					</div>
				</div>
			</van-collapse-item>
		</van-collapse>
		<div class="btn dis">
			<div class="btn_box dis" @click="submit">
				提现
			</div>
		</div>
	</div>
</template>

<script>
	import {
		selectAgentChannelInf,
		selectAgentAccount,
		getCash,
		selectAgencyConfig
	} from '@/api/terminal'
	import store from '@/store'
	import {
		showToast
	} from 'vant'
	import {
		useRoute,
		useRouter,
		RouterView
	} from 'vue-router'
	import {
		defineComponent,
		reactive,
		toRefs,
		ref,
		onMounted

	} from 'vue';
	export default defineComponent({
		name: 'sateActive',
		setup() {
			// const router = useRouter()
			const state = reactive({
				active: [],
				tabList: [],
				channelCode: "",
				// list:[],
				type: 0,
				withdrawRange: ""
			})
			const pictchUp = (e, indexs, index) => {
				// console.log('asd')
				if (e.accountBalance > 0) {
					if (!state.tabList[index].list[indexs].typeIndex) {
						state.tabList[index].list[indexs]['typeIndex'] = true
					} else {
						state.tabList[index].list[indexs]['typeIndex'] = false
					}
				} else {
					showToast('账户余额不足')
				}
				console.log(state.tabList)
			}
			//获取提现区别
			const getselectAgencyConfig = () => {
				selectAgencyConfig({
					channelCode: state.channelCode
				}).then(res => {
					state.withdrawRange = res.data.withdrawRange.split(',')
					console.log(state.withdrawRange)
				})
			}
			//获取渠道列表
			const getTabList = () => {
				selectAgentChannelInf({
					channelType: 1
				}).then(res => {
					state.tabList = res.data
					for (let i in state.tabList) {
						state.tabList[i]['spread'] = false
					}
					state.active.push(res.data[0].channelCode)
					state.tabList[0].spread = 1
					state.channelCode = state.tabList[0].channelCode
					getselectAgencyConfig()
					getFindPageList()
				})
			}
			//查询账户
			const getFindPageList = () => {
				selectAgentAccount({
					channelCode: state.channelCode,
				}).then(res => {
					for (let i in res.data.agentAcountList) {
						res.data.agentAcountList[i]['typeIndex'] = false
					}
					state.tabList[state.type]['list'] = res.data.agentAcountList
					// state.list = res.data.agentAcountList
				})
			}
			//选择展开
			const vancollapse = (e, index) => {
				console.log(e)
				state.active = e
				if (e.length > 0) {
					for (let i in state.tabList) {
						if (state.tabList[i].channelCode == e[e.length - 1]) {
							state.type = i
							state.channelCode = e[e.length - 1]
							console.log(state.tabList[i].spread)
							if (state.tabList[i].spread == 0) {
								state.tabList[i].spread = 1
								getFindPageList()
							}
						}

					}
				}
			}
			//提现
			const submit = () => {

				let parames = {
					listString: [],
					isMerge: 1
				}
				let moneyList = []
				let balance = 0
				for (let i in state.tabList) {
					for (let k in state.tabList[i].list) {
						if (state.tabList[i].list[k].typeIndex) {
							parames.listString.push(state.tabList[i].list[k])
							moneyList.push(state.tabList[i].list[k])
						}
					}
				}
				console.log(parames)
				if (!parames.listString.length > 0) {
					showToast('未选择渠道提现')
					return
				}
				for (let i in moneyList) {
					balance = Number(balance) + Number(moneyList[i].accountBalance)
				}
				console.log(balance,state.withdrawRange)
				if (balance > Number(state.withdrawRange[1]) || balance < Number(state.withdrawRange[0])) {
					showToast("不满足提现要求")
					return
				}
				parames.listString = JSON.stringify(parames.listString)
				// return

				getCash(parames).then(res => {
					for (let i in state.tabList) {
						for (let k in state.tabList[i].list) {
							if (state.tabList[i].list[k].typeIndex) {
								state.tabList[i].list[k].accountBalance = 0.00
								state.tabList[i].list[k].typeIndex = false
							}
						}
					}
					showToast('提现成功')
				})
			}
			getTabList()
			// const getFindPageList = () => {
			//     findSetPosFeeList({
			//         currentPage: state.currentPage,
			//         ...state.childData
			//     }).then(res => {
			//         if (res.object.length < 10) {
			//             state.finished = true
			//             state.loading = false
			//         } else {
			//             state.currentPage++
			//             state.finished = false
			//             state.loading = false
			//         }
			//         state.posList = state.posList.concat(res.object)
			//     })
			// }

			return {
				...toRefs(state),
				pictchUp,
				getTabList,
				getFindPageList,
				vancollapse,
				submit,
				getselectAgencyConfig
			}
		}
	})
</script>
<style scoped lang="scss">
	.wrapper {
		width: 100%;
		height: 100%;
		min-height: 100vh;
		background-color: #FFF9F9;
		padding-bottom: 24px;
		box-sizing: border-box;

		.benefit {
			// border-bottom: 1px solid rgb(0, 0, 0,0.04);
			padding-bottom: 10px;
			box-sizing: border-box;
			margin-top: 4px;

		}

		img {
			width: 12px;
			height: 12px;
		}

		.btn {
			// position: absolute;
			// bottom: 10%;
			// left: 50%;
			// transform: translateX(-50%);
			margin-top: 54px;

			.btn_box {
				width: 339px;
				height: 40px;
				background: #ff2828;
				border-radius: 6px 6px 6px 6px;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 14px;
				color: #FFFFFF;
			}
		}
	}
</style>